﻿{% layout 'checkout' %}

<div class="col-md-7">
    <div class="box">
        <div class="form-horizontal">
            {% form 'edit_checkout_step_1', checkout %}
                <div class="box-header">
                    <h2>Shipping address</h2>
                </div>
                <div class="box-content">
                    <div class="form-group has-feedback">
                        <label class="col-sm-4 control-label" for="checkout_email">Email</label>
                        <div class="col-sm-8">
                            <input class="form-control" id="checkout_email" name="checkout[email]" required="required" type="email" value="{{ checkout.email }}" />
                            <span aria-hidden="true" class="glyphicon glyphicon-exclamation-sign form-control-feedback"></span>
                        </div>
                    </div>
                    <hr />
                    {% if checkout.guest_login != true and customer.addresses.size > 0 %}
                        <div class="form-group">
                            <label class="col-sm-4 control-label" for="checkout_email">Addresses</label>
                            <div class="col-sm-8">
                                <select class="form-control" id="customer-addresses">
                                    {% for address in customer.addresses %}
                                        <option value="{{ address.id }}">
                                            <a href="#">
                                                {{address.city}} {{ address.street }},
                                                {{ address.country }},
                                                {% if address.province != null %}
                                                    {{ address.province }},
                                                {% endif %}
                                                {{ address.name }}
                                            </a>
                                        </option>
                                    {% endfor %}
                                </select>
                            </div>
                        </div>
                        <hr />
                    {% endif %}
                    <div class="form-group has-feedback">
                        <label class="col-sm-4 control-label" for="checkout_first_name">First name</label>
                        <div class="col-sm-8">
                            <input class="form-control" id="checkout_first_name" name="checkout[first_name]" required="required" type="text" value="{{ checkout.shipping_address.first_name }}" />
                            <span aria-hidden="true" class="glyphicon glyphicon-exclamation-sign form-control-feedback"></span>
                        </div>
                    </div>
                    <div class="form-group has-feedback">
                        <label class="col-sm-4 control-label" for="checkout_last_name">Last name</label>
                        <div class="col-sm-8">
                            <input class="form-control" id="checkout_last_name" name="checkout[last_name]" required="required" type="text" value="{{ checkout.shipping_address.last_name }}" />
                            <span aria-hidden="true" class="glyphicon glyphicon-exclamation-sign form-control-feedback"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="checkout_country">Country</label>
                        <div class="col-sm-8">
                            <select class="form-control" id="checkout_country" name="checkout[country]" required="required">{{ country_option_tags }}</select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="checkout_province">Province</label>
                        <div class="col-sm-8">
                            <select class="form-control" data-default="{{ form.province }}" id="checkout_province" name="checkout[province]"></select>
                        </div>
                    </div>
                    <div class="form-group has-feedback">
                        <label class="col-sm-4 control-label" for="checkout_city">City</label>
                        <div class="col-sm-8">
                            <input class="form-control" id="checkout_city" name="checkout[city]" required="required" type="text" value="{{ checkout.shipping_address.city }}" />
                            <span aria-hidden="true" class="glyphicon glyphicon-exclamation-sign form-control-feedback"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="checkout_company">Company</label>
                        <div class="col-sm-8">
                            <input class="form-control" id="checkout_company" name="checkout[company]" type="text" value="{{ checkout.shipping_address.company }}" />
                        </div>
                    </div>
                    <div class="form-group has-feedback">
                        <label class="col-sm-4 control-label" for="checkout_address1">Address line 1</label>
                        <div class="col-sm-8">
                            <input class="form-control" id="checkout_address1" name="checkout[address1]" required="required" type="text" value="{{ checkout.shipping_address.address1 }}" />
                            <span aria-hidden="true" class="glyphicon glyphicon-exclamation-sign form-control-feedback"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="checkout_address2">Address line 2</label>
                        <div class="col-sm-8">
                            <input class="form-control" id="checkout_address2" name="checkout[address2]" type="text" value="{{ checkout.shipping_address.address2 }}" />
                        </div>
                    </div>
                    <div class="form-group has-feedback">
                        <label class="col-sm-4 control-label" for="checkout_zip">Zip / Postal code</label>
                        <div class="col-sm-8">
                            <input class="form-control" id="checkout_zip" name="checkout[zip]" required="required" type="text" value="{{ checkout.shipping_address.zip }}" />
                            <span aria-hidden="true" class="glyphicon glyphicon-exclamation-sign form-control-feedback"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="checkout_phone">Phone</label>
                        <div class="col-sm-8">
                            <input class="form-control" id="checkout_phone" name="checkout[phone]" type="text" value="{{ checkout.shipping_address.phone }}" />
                        </div>
                    </div>
                </div>
                <div class="box-footer">
                    <div class="pull-right">
                        <button class="btn btn-primary themed" type="submit">Continue</button>
                    </div>
                </div>
            {% endform %}
        </div>
    </div>
</div>
{% include 'checkout_totals' %}